{extend name="public/base"/}
{block name="css"}
<link href="{$Think.ADMIN_STATIC}css/notebook.css" rel="stylesheet">
<link href="{$Think.ADMIN_STATIC}css/editormd.css" rel="stylesheet">
<link href="{$Think.EDITOR_PATH}lib/codemirror/codemirror.min.css" rel="stylesheet">
<link href="{$Think.ADMIN_STATIC}css/font-awesome.min.css" rel="stylesheet">
{/block}

{block name="center_left"}
<div id="navsecond" class="float-left">
    <div class="catalog" data-coverid='{$cover_id}' data-shelfid="{$shelf_id}">
        <div class="title" data-value="{$cover_name}">
            笔记本：{$cover_name}学习笔记
            <b class='fa fa-hand-o-left fa-inverse' title='编辑中...'></b>
        </div>
    </div>
    <div class="innerUl">
        <ul class='menuUl' id="rootMenu" data-level="0">
            {volist name="catelog_info" id="item"}
            <li data-id='{$item.id}' data-parentid="0" >
                <i draggable='true' ischek='false' class='fa fa-folder fa-inverse isfolder'></i>
                <span>{$item.catalog_name}</span>
            </li>
            {/volist}
        </ul>
    </div>
</div>
{/block}

{block name="center_main"}
<div id="maincontent" class="float-right">
    <ul id="articleNav">
        <li><span>{$cover_name}学习笔记</span></li>
    </ul>
    <ul id="articleList" data-parentid='0'>
        {volist name="article_info" id="item"}
        <li data-id='{$item.id}'>
            <i draggable='true' class='fa fa-file fa-inverse isfile'></i>
            <span>{$item.article_title}</span>
        </li>
        {/volist}
    </ul>

    <div id="articleMain" style="display: none;">
        <div id="articleTitle">
            <h2 style="text-align: center;"></h2>
            <div id="articleOperate">
                <a href="javascript:;" id="doFullScreen"><i class="iconfont blog-quanping"></i> 全屏</a>
                <a href="javascript:;" id="backList" title="返回文章列表"><i class="iconfont blog-back"></i> 返回</a>
            </div>
            <h3>文章描述：&nbsp;<span></span></h3>
        </div>
        <div id="articleContent">

        </div>
    </div>
</div>
{/block}

{block name="before_footer"}
<div id="fullScreen" style="display: none">
    <div id="fullScreenTitle">
        <h2 style="text-align: center;"></h2>
        <div id="fullScreenOperate">
            <a href="javascript:;" id="exitFullScreen"><i class="iconfont blog-back"></i> 返回</a>
        </div>
        <h3>文章描述：&nbsp;<span></span></h3>
    </div>
    <div id="fullScreenContent" class="markdown-body editormd-html-preview">
    </div>
    <div id="fullScreenCatalog" class="markdown-body editormd-preview-container" previewcontainer="false">

    </div>
    <div class="clear"></div>
</div>
<div id="articleEdit"></div>
{/block}

{block name="after_footer"}
<div class="operate" id="operate">
    <div id="createfile"><i class="fa fa-file-o fa-fw"></i>&nbsp;&nbsp;创建</div>
    <div id="createfolder"><i class="fa fa-folder-o fa-fw"></i>&nbsp;&nbsp;创建</div>
    <div id="edit" style="display: none;"><i class="fa fa-edit fa-fw"></i>&nbsp;&nbsp;编辑</div>
    <div id="trash"><i class="fa fa-trash-o fa-fw"></i>&nbsp;&nbsp;删除</div>
    <div id="close"><i class="fa fa-close fa-fw"></i>&nbsp;&nbsp;关闭</div>
    <input type="hidden" value="0" title="id">
</div>
{/block}

{block name="footer_js"}
<script src="{$Think.STATIC_PATH}js/require.min.js"></script>
<script type="text/javascript">
    require.config({
        baseUrl: "{$Think.EDITOR_PATH}",
        paths: {
            jquery          : "../js/jquery.min",
            marked          : "lib/marked.min",
            prettify        : "lib/prettify.min",
            raphael         : "lib/raphael.min",
            underscore      : "lib/underscore.min",
            flowchart       : "lib/flowchart.min",
            jqueryflowchart : "lib/jquery.flowchart.min",
            sequenceDiagram : "lib/sequence-diagram.min",
            katex           : "lib/katex.min",
            editormd        : "editormd.amd",
            operate         : "../admin/js/notebook.operate",
            hDialog         : "../admin/js/jquery.hDialog"
        },
        shim: {
            'operate': {
                deps: ['flowchart', 'raphael', 'editormd']
            },
            'hDialog': {
                deps: ['jquery']
            },
            'editormd':{
                deps: ['hDialog']
            }
        },
        waitSeconds: 30
    });

    var deps = [
        "editormd",
        "hDialog",
        "operate",
        "../editor.md-master/plugins/link-dialog/link-dialog",
        "../editor.md-master/plugins/reference-link-dialog/reference-link-dialog",
        "../editor.md-master/plugins/image-dialog/image-dialog",
        "../editor.md-master/plugins/code-block-dialog/code-block-dialog",
        "../editor.md-master/plugins/table-dialog/table-dialog",
        "../editor.md-master/plugins/emoji-dialog/emoji-dialog",
        "../editor.md-master/plugins/goto-line-dialog/goto-line-dialog",
        "../editor.md-master/plugins/help-dialog/help-dialog",
        "../editor.md-master/plugins/html-entities-dialog/html-entities-dialog",
        "../editor.md-master/plugins/preformatted-text-dialog/preformatted-text-dialog"
    ];

    require(deps, function(editormd) {
        $("body").Operate({
            simIcon: "fa fa-file fa-inverse isfile",
            mouIconOpen: "fa fa-folder-open-o fa-inverse isfolder",
            mouIconClose: "fa fa-folder fa-inverse isfolder",
            mouIconEmpty: "fa fa-folder-o isfolder",
            updateCatalogNameUrl: "{:url('admin/notebook/updateCatalogName')}",
            addCatalogUrl: "{:url('admin/notebook/addCatalog')}",
            getCatalogUrl: "{:url('admin/notebook/getCatalog')}",
            getArticleListUrl: "{:url('admin/notebook/getArticleList')}",
            getArticleUrl: "{:url('admin/notebook/getArticle')}",
            editUploadUrl: "{:url('admin/notebook/editUpload')}",
            saveArticleUrl: "{:url('admin/notebook/saveArticle')}",
            delArticleUrl: "{:url('admin/notebook/delArticle')}",
            imageDeleteUrl: "{:url('admin/notebook/imageDelete')}",
            editPath: "{$Think.EDITOR_PATH}",
            editormd: editormd,
            callbackEdit: function(id){
                alert(id);
            }

        });
    });
</script>
{/block}